<template>
  <div>
    <div class="tjwz" :class="$store.state.tjwz==true?'gl_tjym':''">
      <div class="tjwz_title" v-if="$store.state.tjwz">
        <h3 v-if="$store.state.xiugaiflag==''">添加文章</h3>
        <h3 v-if="$store.state.xiugaiflag!=''">修改文章</h3>
        <a-icon @click="quxiao" type="close" />
      </div>
      <div class="tjwz_tab">
        <a-icon type="crown" class="bdyh_ico" />
        <a-tabs :defaultActiveKey="wztabs" @change="callback">
          <a-tab-pane tab="常规" key="1">
            <div class="tjwz_cg">
              <div class="cg_n">
                <div class="yybb">
                  语言版本：
                  <a-radio-group v-model="langvalue" @change="langChange">
                    <a-row>
                      <a-col class="yychack" v-show="language.cnName!=0?true:false">
                        <a-radio :disabled="langflag" :value="0">中文</a-radio>
                      </a-col>
                      <a-col class="yychack" v-show="language.enName!=0?true:false">
                        <a-radio :disabled="langflag" :value="1">英文</a-radio>
                      </a-col>
                      <a-col class="yychack" v-show="language.ruName!=0?true:false">
                        <a-radio :disabled="langflag" :value="4">俄文</a-radio>
                      </a-col>
                      <a-col class="yychack" v-show="language.dwName!=0?true:false">
                        <a-radio :disabled="langflag" :value="2">德文</a-radio>
                      </a-col>
                      <a-col class="yychack" v-show="language.jaName!=0?true:false">
                        <a-radio :disabled="langflag" :value="3">日文</a-radio>
                      </a-col>
                    </a-row>
                  </a-radio-group>
                </div>
                <div>
                  标题：
                  <a-input class="cg_inp" placeholder="请输入标题" v-model="wztitle" />
                  <span class="red">*</span>
                  <div v-if="wzflag" style="color:#ff3040;margin:10px 80px;">
                    <a-icon style="margin-right:10px;" type="close-circle" theme="filled" />标题不能为空！！！
                  </div>
                </div>
                <div class="gjfl_header">
                  <div class="djfl">
                    文章分类：
                    <a-select
                      showSearch
                      :allowClear="true"
                      placeholder="请选择分类"
                      optionFilterProp="children"
                      style="width: 200px"
                      @focus="handleFocus"
                      @blur="handleBlur"
                      @change="handleChange"
                      :filterOption="filterOption"
                      :getPopupContainer="triggerNode => triggerNode.parentNode"
                      :defaultValue="$store.state.tjwz==true&&$store.state.articleClass!=0?$store.state.articleClass:'请选择分类'"
                    >
                      <a-select-option
                        v-for="(item,i) in $store.state.articleName"
                        :key="i"
                        :data-value="item.articleName"
                        :value="item.id_num"
                      >{{item.articleName}}</a-select-option>
                    </a-select>
                    
                  </div>
                  <div class="glfl" v-if="$route.path!='/qywz'">
                    <a-button @click="glfl">管理分类</a-button>
                    <div class="wzflym" v-if="$store.state.wzfl">
                      <wzflym class="wz"></wzflym>
                    </div>
                  </div>
                </div>

                <!-- 富文本编辑器 -->
                <div v-if="wzflag" style="color:#ff3040;margin:10px 0px;">
                  <a-icon style="margin-right:10px;" type="close-circle" theme="filled" />内容不能为空！
                </div>
                <div class="edit_container">
                  <!-- <p v-html="content"></p>s -->
                  <!-- <quill-editor
                    v-model="content"
                    ref="myQuillEditor"
                    :options="editorOption"
                    @blur="onEditorBlur($event)"
                    @focus="onEditorFocus($event)"
                    @change="onEditorChange($event)"
                  ></quill-editor>-->
                  <!-- <froala id="edit" :tag="'textarea'" placeholder="请输入" :config="config" v-model="content"></froala> -->
                  <Editor ref="froalaEditor" @open="init" @on-change="changeContent"></Editor>
                  <!-- <froalaView v-model="content"></froalaView> -->
                </div>
                <div class="cg_sunbtn">
                  <a-button type="primary" @click="tjwzsub">保存</a-button>
                  <a-button @click="quxiao">取消</a-button>
                </div>
              </div>
            </div>
          </a-tab-pane>
          <a-tab-pane tab="高级" key="2" forceRender>
            <div class="tjwz_cg">
              <div class="cg_n gj_n">
                <div class="tjwz_gj">
                  <div class="form_inp">
                    <span class="span_rig">发布时间：</span>
                    <a-date-picker
                      class="date"
                      label="pushTime"
                      :placeholder="pushTime"
                      style="width:205px;"
                      @change="onChangedate"
                    />
                  </div>

                  <div class="form_inp">
                    <span class="span_rig">文章摘要：</span>
                    <a-textarea class="f_in text" v-model="articleRemark" :rows="4" />
                  </div>
                  <div class="form_inp zindex">
                    <span class="span_rig">列表图片：</span>

                    <a-radio-group name="radioGroup" @change="radiochange" v-model="picList">
                      <a-radio :value="1">与正文头图一致</a-radio>
                      <a-radio :value="2">自定义</a-radio>
                    </a-radio-group>

                    <div class="clearfix" v-if="picList==2">
                      <a-upload
                        action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
                        listType="picture-card"
                        :fileList="fileListpic"
                        accept=".png, .jpg, .jpeg"
                        @preview="handlePreview"
                        @change="addupChange"
                      >
                        <div v-if="fileListpic.length < 1">
                          <a-icon type="plus" />
                          <div class="ant-upload-text">上传</div>
                        </div>
                      </a-upload>
                      <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
                        <img alt="example" style="width: 100%" :src="previewImage" />
                      </a-modal>
                    </div>
                  </div>
                  <!-- <div class="form_inp fjsc">
                    <span class="span_rig">附件上传：</span>
                    <div class="scexel">
                      <a-upload-dragger
                        name="file"
                        accept=".xls, .xlsx"
                        @change="Changesjdr"
                        :fileList="fileList"
                        :showUploadList="true"
                        action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
                      >
                        <p class="ant-upload-text">添加附件</p>
                      </a-upload-dragger>
                    </div>
                  </div>-->
                </div>

                <div class="cg_sunbtn">
                  <a-button type="primary" @click="tjwzsub">保存</a-button>
                  <a-button @click="quxiao">取消</a-button>
                </div>
              </div>
            </div>
          </a-tab-pane>
          <a-tab-pane tab="百度优化" key="3">
            <div class="tjwz_cg">
              <div class="cg_n bdyh_n">
                <div class="tjwz_gj">
                  <div class="form_inp bdyh_input">
                    <span class="bdyh_rig">文章浏览器标题：</span>
                    <a-input class="f_in" v-model="browserTitle" placeholder />
                  </div>

                  <div class="form_inp bdyh_input">
                    <span class="bdyh_rig">文章详情页关键字：</span>
                    <a-textarea class="f_in text" v-model="browserKeyword" :rows="4" />
                  </div>
                  <div class="form_inp bdyh_input">
                    <span class="bdyh_rig">文章详情页描述：</span>
                    <a-textarea class="f_in text" v-model="browserDescribe" :rows="4" />
                  </div>
                </div>

                <div class="cg_sunbtn">
                  <a-button type="primary" @click="tjwzsub">保存</a-button>
                  <a-button @click="quxiao">取消</a-button>
                </div>
              </div>
            </div>
          </a-tab-pane>
        </a-tabs>
      </div>
    </div>
  </div>
</template>

<script>
import wzflym from "../wzfl/wzflym.vue";
import moment from "moment";
import qs from "qs";
// import VueFroala from "vue-froala-wysiwyg";
// fffffffffffffffffffffffffffffffff
import Editor from "../froalaed/froalaed.vue";
//上传图片
function getBase64(img, callback) {
  const reader = new FileReader();
  let file = [];
  file = reader;
  reader.addEventListener("load", () => callback(reader.result));
  reader.readAsDataURL(img);
  sessionStorage.setItem("file", reader);
}
export default {
  inject: ["reload"],
  filters: {
    formatDate() {
      let data = new Date();
      return moment(data).format("YYYY-MM-DD");
    }
  },
  data() {
    return {
      language: "",
      articleName: [],
      dateFormat: "YYYY/MM/DD",
      monthFormat: "YYYY/MM",
      wztabs: "1",
      wzflag: false,
      newdate: new Date(),
      langflag: this.$store.state.xiugaiflag != "" ? true : false,
      langvalue:
        this.$store.state.xiugaiflag != ""
          ? Number(this.$store.state.radiolang)
          : "",
      wztitle:
        this.$store.state.xiugaiflag != "" ? this.$store.state.title : "", //文章标题
      content:
        this.$store.state.xiugaiflag != "" ? this.$store.state.content : "", //富文本编辑器
      articleClass:
        this.$store.state.xiugaiflag != ""
          ? this.$store.state.articleClass
          : "", //获取文章分类

      pushTime:
        this.$store.state.xiugaiflag != ""
          ? moment(this.$store.state.pushTime).format("YYYY-MM-DD")
          : moment(this.newdate).format("YYYY-MM-DD"), //获取发布时间
      source:
        this.$store.state.xiugaiflag != "" ? this.$store.state.source : "", //获取来源
      author:
        this.$store.state.xiugaiflag != "" ? this.$store.state.author : "", //获取作者
      articleRemark:
        this.$store.state.xiugaiflag != ""
          ? this.$store.state.articleRemark
          : "", //获取文章摘要
      picList:
        this.$store.state.xiugaiflag != "" ? this.$store.state.picList : 1, //获取列表图片
      browserTitle:
        this.$store.state.xiugaiflag != ""
          ? this.$store.state.browserTitle
          : "", //获取优化的浏览器标题
      browserKeyword:
        this.$store.state.xiugaiflag != ""
          ? this.$store.state.browserKeyword
          : "", //获取优化的浏览器详情页关键字
      browserDescribe:
        this.$store.state.xiugaiflag != ""
          ? this.$store.state.browserDescribe
          : "", //获取优化的浏览器详情页描述
      glxgsqdwid:
        this.$store.state.xiugaiflag != "" ? this.$store.state.glxgsqdwid : "",
      editorOption: {}, //富文本编辑器
      //附件上传-----------------
      fileList:
        this.$store.state.xiugaiflag != ""
          ? []
          : [
              {
                uid: "-1",
                name: "上传类型/.xls/.xlsx",
                status: "done",
                url: "http://www.baidu.com/xxx.png"
              }
            ],
      uploading: false,
      exelUrl:
        this.$store.state.xiugaiflag != "" ? this.$store.state.annex : "", //exel表格的baes64格式路径
      xlshz: "", //上传的exel表格的后缀名
      //高级-----开始
      wzfl: false,
      upimglength: "",
      previewVisible: false,
      previewImage: "",
      fileListpic: [],
      formData: {
        content: ""
      },
      //高级-----结束
      //添加文章--上传图片
      tjwzimgUrl:
        this.$store.state.xiugaiflag != "" ? this.$store.state.tjwzimgUrl : "",
      flmodel: ""
    };
  },
  components: {
    wzflym,
    // fffffffffffffffffffffffffffffffff
    Editor
  },
  methods: {
    moment,
    callback(key) {
      this.wztabs = key;
    },
    // fffffffffffffffffffffffffffffffff
    init() {
      console.log("!1111111111");
      this.$nextTick(() => {
        console.log(this.content);
        this.$refs.froalaEditor.setHtml(this.content);
      });
    },
    changeContent(html) {
      this.content = html;
    },
    // fffffffffffffffffffffffffffffffff

    // 语言版本多选框
    langChange(e) {
      console.log("radio checked", e.target.value);
    },
    // 常规-------------------开始
    //富文本编辑器
    onEditorReady(editor) {
      // 准备编辑器
    },
    onEditorBlur() {}, // 失去焦点事件
    onEditorFocus() {}, // 获得焦点事件
    onEditorChange() {}, // 内容改变事件

    //富文本编辑器
    // 常规-------------------结束
    // 高级-------------------开始

    //点击分类
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toUpperCase()
          .indexOf(input.toUpperCase()) >= 0
      );
    },
    //发布时间事件
    onChangedate(date, dateString) {
      this.pushTime = dateString;
    },
    //列表图片单选事件
    radiochange(e) {
      this.picList = e.target.value;
    },
    //附件上传
    Changesjdr(info) {
      let fileList = [...info.fileList];
      const status = info.file.status;

      fileList = fileList.slice(-1);
      //上传中....
      if (status !== "uploading") {
      }
      //上传后....
      if (status === "done") {
        getBase64(info.file.originFileObj, xlxurl => {
          this.exelUrl = xlxurl;

          this.loading = false;
          this.file = info.file.originFileObj;
        });
      } else if (status === "error") {
        this.$message.error(`${info.file.name} 上传失败.`);
      }
      fileList = fileList.map(file => {
        if (file.response) {
        }
        return file;
      });

      this.fileList = fileList;
      if (this.fileList == "") {
        this.exelUrl = "";
      }
    },
    //分类管理面版打开事件
    glfl() {
      this.$store.state.wzfl = true;
    },

    handleCancel() {
      this.previewVisible = false;
    },
    handlePreview(file) {
      this.previewImage = file.url || file.thumbUrl;
      this.previewVisible = true;
    },

    addupChange({ fileList }) {
      this.fileListpic = fileList;

      if (fileList != "") {
        this.tjwzimgUrl = fileList[0].thumbUrl;
      } else {
        this.tjwzimgUrl = [];
      }
    },
    // 高级-------------------结束
    //取消
    quxiao() {
      this.$store.state.glxgsqdwid = "";
      this.$store.state.tjwz = false;
      this.$store.state.xiugaiflag = "";
    },
    //添加文章保存
    tjwzsub() {
      if (this.fileList.length) {
        let name = this.fileList[0].name;
        var i = name.indexOf(".");
        var data = name.substring(i + 1, name.length);
        this.xlshz = data;
      }

      if (this.$store.state.xiugaiflag != "") {
        if (this.wztitle != "" && this.content != "") {
          //修改文章
          this.axios
            .post(
              "wenzhang/AdminArticleListEdit.php",
              qs.stringify({
                id_num: this.$store.state.id_num,
                title: this.wztitle,
                // content: this.content,
                content: this.content,
                articleClass: this.articleClass,
                pushTime: this.pushTime,
                source: this.source,
                author: this.author,
                articleRemark: this.articleRemark,
                picList: this.picList,
                browserTitle: this.browserTitle,
                browserKeyword: this.browserKeyword,
                browserDescribe: this.browserDescribe,
                sqdwid: this.glxgsqdwid,
                pic: this.tjwzimgUrl,
                annex: this.exelUrl,
                fileSuffix: this.xlshz
              })
            )
            .then(res => {
              if (res.data.code == 303) {
                this.$notification["success"]({
                  message: "成功",
                  description: res.data.msg
                });
                this.reload();
                this.$store.state.tjwz = false;
                this.$store.state.xiugaiflag = "";
              } else {
                this.$notification["error"]({
                  message: "失败",
                  description: res.data.msg
                });
              }
            });
        } else {
          this.$notification["error"]({
            message: "失败",
            description: "文章标题与内容不能为空!!!"
          });
          this.wzflag = true;
        }
      } else {
        if (this.wztitle != "" && this.content != "") {
          //添加文章
          this.axios
            .post(
              "wenzhang/AddArticle.php",
              qs.stringify({
                sqdwid:
                  this.$store.state.qywzkhid == ""
                    ? this.$store.state.bbl_sqdwid
                    : this.$store.state.qywzkhid, //获取客户授权ID
                gsmc:
                  this.$store.state.qywzgsmc == ""
                    ? sessionStorage.getItem("dwmc")
                    : this.$store.state.qywzgsmc,
                title: this.wztitle, //获取文章标题
                // content: this.content, //获取文章内容
                content: this.content,
                articleClass: this.articleClass, //获取文章分类
                pushTime: this.pushTime, //获取发布时间
                source: this.source, //获取来源
                author: this.author, //获取作者
                articleRemark: this.articleRemark, //获取文章摘要
                picList: this.picList, //获取列表图片
                browserTitle: this.browserTitle, //获取优化的浏览器标题
                browserKeyword: this.browserKeyword, //获取优化的浏览器详情页关键字
                browserDescribe: this.browserDescribe, //获取优化的浏览器详情页描述
                pic: this.tjwzimgUrl,
                annex: this.exelUrl,
                fileSuffix: this.xlshz,
                language: this.langvalue
              })
            )
            .then(res => {
              if (res.data.code == 303) {
                this.$notification["success"]({
                  message: "成功",
                  description: res.data.msg
                });
                this.reload();
                this.$store.state.tjwz = false;
                this.$store.state.xiugaiflag = "";
              } else {
                this.$notification["error"]({
                  message: "失败",
                  description: res.data.msg
                });
              }
            });
          this.wzflag = false;
        } else {
          this.$notification["error"]({
            message: "失败",
            description: "文章标题与内容不能为空!!!"
          });
          this.wzflag = true;
        }
      }
    },
    initialize: function(initControls) {
      this.initControls = initControls;
      this.deleteAll = () => {
        this.initControls.getEditor().html.set("");
        this.initControls.getEditor().undo.reset();
        this.initControls.getEditor().undo.saveStep();
      };
    },
    //文章---分类名称列表--开始
    handleChange(value) {
      this.articleClass = value;
      console.log("111111111", value);
    },
    handleBlur() {},
    handleFocus() {}
  },

  created() {
    this.language = JSON.parse(sessionStorage.getItem("language"));
    console.log(this.langvalue);
    console.log(this.content);
    //获取分类
    this.$store.commit("getwzfl");
    // this.articleName = this.$store.state.articleName;
    // console.log(this.$store.state.articleName);
    //修改数据渲染
    if (
      this.$store.state.xiugaiflag != "" &&
      this.$store.state.tjwzimgUrl != " "
    ) {
      let list = {
        uid: " ",
        name: " ",
        status: " ",
        url:
          "https://image.bearing.cn/qy/member/" +
          this.$store.state.glxgsqdwid +
          "/" +
          this.$store.state.tjwzimgUrl
      };
      this.fileListpic.push(list);
      let xlx = {
        uid: " ",
        name:
          this.$store.state.annex == " " ? "无文件" : this.$store.state.annex,
        status: " ",
        url:
          "https://image.bearing.cn/qy/member/" +
          this.$store.state.glxgsqdwid +
          "/" +
          this.$store.state.annex
      };
      this.fileList.push(xlx);
    }
  }
};
</script>

<style lang='less'>
.ant-calendar-picker-container {
  z-index: 99999 !important;
}
.tjwz {
  width: 98%;
  margin: 0 auto;
  position: relative;
  top: 66px;
  text-align: left;
  background-color: #fff;

  .ant-tabs-nav-container {
    line-height: 0 !important;
  }
  .tjwz_tab {
    position: relative;
    width: 100%;
    padding: 0px 20px;
    .bdyh_ico {
      position: absolute;
      top: 17px;
      left: 269px;
      color: #fc6500;
      font-size: 18px;
    }
    .ant-tabs-tab-active {
      color: #1890ff;
    }
    .ant-tabs-tab:hover {
      color: #1890ff;
    }
    .ant-tabs-ink-bar {
      background-color: #1890ff;
      height: 3px;
    }
    .ant-tabs-tab {
      text-align: center;
      font-size: 16px;
      margin-right: 40px !important;
      padding: 25px !important;
    }
    .tjwz_cg {
      position: relative;
      width: 100%;
      height: 720px;
      .cg_n {
        position: relative;
        left: 5px;
        padding: 20px 50px;
        width: 99%;
        height: 640px;
        // border: 1px solid #ccc;
        // box-shadow: 0px 0px 7px #ccc;
        .yybb {
          margin-bottom: 20px;
        }
        .yybb .yychack {
          // width: 6%;
          display: inline-block;
        }

        .yybb .ant-checkbox-group {
          width: 85%;
          vertical-align: middle;
        }
        .gjfl_header {
          margin-top: 20px;
          width: 70%;
          display: flex;
          justify-content: space-between;
        }
        .cg_inp {
          width: 50%;
        }
        .red {
          margin-left: 10px;
          color: red;
          font-size: 18px;
        }
        .edit_container {
          position: relative;
          top: 0;
          margin: 25px 0;
          width: 89%;

          .ql-container {
            height: 320px !important;
          }
        }
        .cg_sunbtn {
          position: relative;
          bottom: 0;
          width: 89%;
          text-align: center;
          button {
            width: 12%;
            margin: 0 20px;
          }

          .ant-btn-default:hover {
            color: #fff !important;
            border: 0 !important;
            background-color: #1890ff !important;
          }
        }
        .wzflym {
          position: fixed;
          height: 867px;
          top: 0;
          left: 0;
          width: 100%;
          z-index: 9999;
          background: rgba(0, 0, 0, 0.5);
          .wz {
            position: absolute;
            left: 42%;
            transform: translateX(-50%);
            width: 100%;
          }
          .wzfl {
            top: 50px;
            left: 96px;
            width: 100%;
          }
        }
      }
      .gj_n {
        width: 99%;
        height: 652px;
      }
      .bdyh_n {
        height: 540px;
        width: 99%;
      }
      .tjwz_gj {
        line-height: 55px;

        .foot_inp {
          bottom: 0px;
          left: -21px;
        }
        .fjsc {
          // bottom: 38px;
        }
        .bdyh_input {
          margin: 30px 0;
        }
        .zindex {
          z-index: 9999;
        }
        .form_inp {
          position: relative;
          .ant-upload.ant-upload-select-picture-card {
            border: 1px dashed #ccc !important;
            width: 104px !important;
            height: 104px !important;
            background: transparent !important;
          }
          .f_in {
            width: 52%;
          }
          .text {
            vertical-align: top;
          }
          .span_rig {
            display: inline-block;
            width: 70px;
            text-align: right;
          }
          .bdyh_rig {
            display: inline-block;
            width: 130px;
            text-align: right;
          }
          .span_dpt {
            width: 90px;
          }
          .date {
            margin-right: 10px;
          }
          .scexel {
            position: relative;
            top: 50px;
            left: 14px;
            width: 157px !important;
            height: 36px;
            display: inline-block;
            border: 0 !important;
            height: 40px !important;
            .ant-upload.ant-upload-drag {
              width: 100% !important;
            }
            .ant-upload {
              padding: 0px 0 !important;
              //   border-radius: 10px !important;
            }
            .ant-upload-drag-icon {
              margin: 0 !important;
              display: inline-block !important;
              .anticon-cloud-upload {
                font-size: 30px !important;
                vertical-align: middle !important;
                margin-right: 10px;
              }
            }
            .ant-upload-text {
              display: inline-block !important;
              color: #000 !important;
            }
            .dr {
              position: absolute;
              top: 0;
              right: -92px;
              height: 51px;
            }
          }
          .ant-upload.ant-upload-drag .ant-upload {
            padding: 0px 0 !important;
            border: 1px solid #ccc;
            //   background-color: #1890ff !important;
          }
          .ant-upload.ant-upload-drag {
            border-radius: 0 !important;
            border: 0 !important;
          }
        }
      }
    }
  }
}
.gl_tjym {
  top: 0px;
  .ant-tabs-bar {
    z-index: 99 !important;
  }

  .ant-tabs .ant-tabs-top-content > .ant-tabs-tabpane,
  .ant-tabs .ant-tabs-bottom-content > .ant-tabs-tabpane {
    position: relative;
    left: 17%;
  }
  .ant-tabs {
    top: -25px !important;
  }
  .tjwz {
    width: 75%;
    min-height: 660px;
  }
  .tjwz .tjwz_tab .tjwz_cg .cg_n .edit_container {
    left: 33px;
  }
  .tjwz .tjwz_tab .tjwz_cg .tjwz_gj {
    line-height: 45px;
    position: relative;
    left: 30px;
  }
  .cg_n {
    top: 5px !important;
    width: 80% !important;
    height: 564px !important;
    padding: 20px !important;
  }
  .tjwz .tjwz_tab .tjwz_cg .bdyh_n {
    height: 487px !important;
  }

  .tjwz .tjwz_tab .tjwz_cg .cg_n .edit_container .ql-container {
    height: 276px !important;
  }
  .ant-tabs-bar {
    background-color: #fff !important;
    height: 230px;
    position: absolute;
    border: 0 !important;
    z-index: 99;
  }

  .ant-tabs-tab {
    display: block !important;
  }
  .tjwz_title {
    width: 100%;
    height: 72px;
    padding: 25px 35px;
    margin-bottom: 35px;
    display: flex;
    justify-content: space-between;
    line-height: 20px !important;
    border-bottom: 1px solid #ccc;
    h3 {
      font-size: 18px;
    }
    .anticon-close {
      font-weight: normal;
      font-size: 22px;
    }
  }
  .ant-tabs-ink-bar {
    transform: none !important;
    background-color: transparent !important;
    height: 0px !important;
  }
  .bdyh_ico {
    position: absolute;
    top: 91px !important;
    left: 119px !important;
    color: #fc6500;
    font-size: 18px;
    z-index: 98 !important;
  }
  .ant-tabs-tab-active {
    color: #1890ff;
    border-left: 3px solid #1890ff;
  }
  .tjwz .tjwz_tab .tjwz_cg .gj_n .wzflym {
    background: rgba(0, 0, 0, 0.1) !important;
  }
}
.tjwz .tjwz_tab .tjwz_cg .cg_n .edit_container {
  z-index: 50;
}
@media (max-width: 1600px) {
  // .glwz_box .tjwz_tab .tjwz_cg {
  //   overflow-y: scroll;
  //   height: 550px;
  //   width: 83%;
  // }
  .tjwz .tjwz_tab .tjwz_cg .cg_n .edit_container {
    width: 100%;
  }
  .gl_tjym .cg_n {
    width: 90% !important;
  }
}
@media (max-width: 1300px) {
  .tjwz .tjwz_tab .tjwz_cg {
    overflow-y: scroll;
    height: 382px;
    width: 83%;
  }
  .tjwz .tjwz_tab .tjwz_cg .cg_n .yybb .ant-checkbox-group .yychack {
    // width: 15%;
  }

  .tjwz .tjwz_tab .tjwz_cg .cg_n .yybb .ant-checkbox-group {
    width: 82%;
  }
  .tjwz .tjwz_tab .tjwz_cg .cg_n .edit_container {
    position: relative;
    top: 0;
    width: 100%;
  }
  .tjwz .tjwz_tab .tjwz_cg .cg_n .gjfl_header {
    width: 71%;
  }
  .tjwz .tjwz_tab .tjwz_cg .cg_n {
    left: 20px;
    height: 100%;
  }
  .tjwz .tjwz_tab .tjwz_cg .cg_n .cg_sunbtn {
    position: relative;
    bottom: 0;
  }
  .tjwz .tjwz_tab .tjwz_cg .cg_n .cg_sunbtn button {
    width: 16%;
  }
}
.ql-snow .ql-editor img {
  width: 30% !important;
}
</style>
